<!DOCTYPE html>
<html lang="en">
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <meta charset="UTF-8">
    <title>文件列表页面</title>
    <link rel="stylesheet" type="text/css"  th:href="@{/css/bootstrap.min.css}"/>
    <script  th:src="@{/js/jquery-3.6.0.js}"></script>
<!-- 定时更新下载次数(1000毫秒=1秒一次)-->
    <script>
        $(function () {
           setInterval(function () {
               $.get("[[@{/file/findAllJSON}]]",function (res) {
                   //遍历
                   $.each(res,function (index,file) {
                       $("#"+file.id).text(file.downcounts);
                   })
               });
           },1000);
        });
    </script>
</head>
<body style="background-color:#CCCC99">
<h2 style="text-align: center">欢迎您:<span th:if="${session.user.username!=null}" th:text="${session.user.username}"/></h2>
<table class="table table-striped table table-bordered">
    <tr>
        <th>ID</th>
        <th>文件原名</th>
        <th>文件新名</th>
        <th>文件后缀</th>
        <th>存储路径</th>
        <th>文件大小</th>
        <th>文件类型</th>
        <th>是否是图片</th>
        <th>下载次数</th>
        <th>上传时间</th>
        <th>操作</th>
    </tr>
    <tr th:each="file,fileStat:${files}">
        <td><span th:text="${file.id}"/></td>
        <td><span th:text="${file.oldFileName}"/></td>
        <td><span th:text="${file.newFileName}"/></td>
        <td><span th:text="${file.ext}"/></td>
        <td><span th:text="${file.path}"/></td>
        <td><span th:text="${file.size}"/> kb</td>
        <td><span th:text="${file.type}"/></td>
        <td><span th:if="${file.isImg}!='Yes'" th:text="${file.isImg}"/>
            <img th:if="${file.isImg}=='Yes'" th:src="${#servletContext.contextPath}+${file.path}+'/'+${file.newFileName}" style="width: 70px;height: 50px"/>
        </td>
        <td th:id="${file.id}"><span th:text="${file.downcounts}"/></td>
        <td><span th:text="${#dates.format(file.uploadTime,'yyyy/MM/dd HH:mm:ss')}"/></td>
        <td >
            <a th:href="@{/file/download(id=${file.id})}">Download</a>
            <a th:href="@{/file/download(id=${file.id},OnlineOpen='inline')}">Detail</a>
            <a th:href="@{/file/delete(id=${file.id})}">Delete</a>
        </td>
    </tr>
</table>
<h3 style="text-align: center">文件上传</h3>
<form th:action="@{/file/upload}" method="post" enctype="multipart/form-data" style="text-align: center">
    <div style="margin:10px 40% "><input type="file" name="choice" class="btn btn-warning"></div>
<!--    <input type="submit" value="上传" class="btn btn-default">-->
    <button type="submit" class="btn btn-info btn-lg " style="width: 30%">上传</button>
</form>
</body>
</html>